<!DOCTYPE html>
<html>
	<head>
		<meta charset="utf-8">
		<title>欢迎回来</title>
		<script type="text/javascript">
			
		</script>
		<style type="text/css">
			.all{
				background:linear-gradient(to left,#0080FF,#00ec00);
				height:100%;
				width: 100%;
				position: fixed;
				min-width: 1000px;
				top: 0;
				left: 0;
				z-index: -20;
				background-repeat: no-repeat;
				background-size:cover ;
				-webkit-background-size:cover;
			}
			.middle{
				background:none;
				height: 70%;
				width: 35%;
				margin-left:32%;
				margin-top:7.5%;
				position: absolute;
			}
			.welcome{
				background: url(111.png);
				margin-left: 42%;
				width: 25%;
				height: 25%;
			}
			.user{
				margin-top: 10%;
				margin-left:10%;
				position: absolute;
				background: url(222.png);				
				width:10%;
				height:10%;
				background-repeat:no-repeat ;
			}
			.userinput{
				float: right;
				font-size: 22px;
				position: absolute;
				margin-left: 100%;
				margin-top: 25%;
				border-top: none;
				border-left: none;
				border-right: none;
				background: none;
			}
			.password{
				margin-top: 22%;
				margin-left: 10%;
				position: absolute;
				background: url(333.png);	
				width: 10%;
				height:10%;
				background-repeat:no-repeat ;
			}
			.enter{
				width: 90%;
				height: 10%;
				margin-left: 10%;
				margin-top: 35%;
				background: orange;
				color: white;
				text-align: center;
				font-size: 25px;
				font-family: 黑体;
				padding: 5px 5px;
				border: none;
				border-radius:25px;
			}
			.register{
				width: 90%;
				height: 10%;
				margin-left: 10%;
				margin-top:2%;       /*看不懂*/
				background: royalblue;
				color: white;
				text-align: center;
				font-size: 25px;
				font-family: 黑体;
				padding: 5px 5px;
				border: none;
				border-radius:25px;       /*记得*/
			}
			.remeber{
				margin-left: 10%;
				margin-top: 5%;
				font-size: 10px;
			}
			.auto{
				float: right;
				font-size: 10px;
			}
			.other{
				margin-top: 5%;
				margin-left: 10%;
			}
			.other2{	
				float: right;			
			}
			::placeholder{
				color: white;
			}
		</style>
	</head>
	<body>
		<form>
		<div class="all">
			<div class="middle">
				<div class="welcome"></div>
				<div class="user"><input name="yonghu" type="text" class="userinput" size="34" placeholder="输入用户名">
				</div>
				<div class="password"><input name="mima" type="password" class="userinput" size="34" placeholder="输入密码">
				</div>
				<input name="enter" type="submit" value="登录" class="enter">
				<input name="password" type="button" value="注册" onclick="" class="register">
				<div class="remeber"><input name="remeber1" type="checkbox" value="记住密码" checked="checked"/><font size="3">记住密码</font>
				<div class="auto"><input name="auto1" type="checkbox" value="自动登录" checked="checked"/><font size="3">自动登录</font></div>
				</div>
				<div class="other"><a href="" name="forget" title="">忘记密码</a>
				<div class="other2"><a href="" name="forget" title="">其他登录方式</a></div>
				</div>
				
			</div>
		</div>
		</form>
	</body>
</html>
